import React from 'react';
import {  View, StyleSheet, ART } from 'react-native';

const { Text,Surface, Shape, Path, Group } = ART;

class DateTag extends React.Component {
    render() {

        const path = new Path()
            .moveTo(0,0)
            .lineTo(40,0)
            .lineTo(40,60)
            .lineTo(20,40)
            .lineTo(0,60)
            .close();

        const pathText = new Path()
            .moveTo(40,5)
            .lineTo(40,99);
        return (
                <View>
                    <Surface width={55} height={60}>
                        <Group>
                            <Shape d={path} stroke="#fff" fill="#FFCC22" strokeWidth={1} /> 
                                <Text
                                strokeWidth={0.5} 
                                numberOfLines={1} 
                                stroke="#fff" 
                                font=" 12px sans-serif"
                                 path={pathText} 
                                 >{this.props.date}</Text>
                        </Group>
                    </Surface>
                </View>
            )
    }
}

module.exports = DateTag;